@charset "utf-8";

@import "config";
//样式配置 ，头尾样式



//banner.js
//=================
.top-banner {
  position: relative;
  @extend %box;
  @extend %mb;
  img {
    @extend %pic-frame;
  }

  @at-root {
    .top-banner-title {
      @extend .main-article-title;
    }

    .top-banner-post-meta {
      @extend .main-article-post-meta;
      float:right;
      font-size: 12px;
      font-weight: normal;
    }
  }

  //每组banner是图片
  @at-root {
    .top-banner-item {
      position: relative;
      transition: all 1s;
      z-index: 10;
      opacity: 1;

      &.hidden{
        z-index: 0;
        opacity: 0;
      }
      img{
        width: 100%;
        height:320px;
        box-sizing: border-box;
      }
    }
  }

  //轮播按钮
  @at-root {
    .top-banner-btn{
      position: absolute;
      top: 312px;
      right: 43px;
      z-index: 99;
      li{
        float: left;
        width: 10px;
        height: 10px;
        margin: 0 5px;
        border-radius: 50%;
        background-color: rgba(255,255,255,.5);
        cursor: pointer;
      }
      li.on{
        background-color: lighten($titleColor, 20);
      }
    }
  }
}

//分页器
@import "modules/pager";
